<template>
  <div class="table-box">
    <ProTable
      ref="proTable"
      :columns="columns"
      :request-api="getSysList"
      :init-param="initParam"
      :data-callback="dataCallback"
      :pagination="false"
      :tool-button="false"
    >
    </ProTable>
  </div>
</template>

<script setup lang="ts" name="SysSetting">
import { ref, reactive } from "vue";
import ProTable from "@/components/ProTable/index.vue";
import { Sys } from "@/api/interface/sysManagement";
import { getSysList } from "@/api/modules/sysManagement/sysSetting";
import { ProTableInstance, ColumnProps } from "@/components/ProTable/interface";

const proTable = ref<ProTableInstance>();
const initParam = reactive({ category: "SECURITY" });

const dataCallback = (data: any) => {
  return data.filter(item => item.key !== "MULTI_LOGIN");
};

// 表格配置项
const columns = reactive<ColumnProps<Sys.ResSysList>[]>([
  { prop: "name", label: "设备名称" },
  { prop: "name2", label: "设备状态" },
  { prop: "name3", label: "IP地址" },
  { prop: "name4", label: "厂商" },
  { prop: "value", label: "型号", width: 180 },
  { prop: "desc", label: "类型" }
]);
</script>

<style scoped lang="scss">
:deep(.table-main) {
  padding: 16px 0 !important;
}
</style>
